import { useState } from 'react'
import AudioControls from '../components/AudioControls'
import RandomList from '../components/RandomList'
import Room from '../components/Room'

const HookUseStateDemo = () => {
  let [counter, setCounter] = useState(0) // [state, setState]


  return (
    <>
      <h2>HookUseStateDemo</h2>
      <h3>Counter {counter}</h3>
      <button
        onClick={() => {
          setCounter((c) => c + 1)
          setCounter((c) => c + 1)
          /* setCounter(counter+1)
          setCounter(counter+1) */
        }}
      >
        加
      </button>
      <button onClick={() => setCounter(counter - 1)}>减</button>

      <Room />
      <RandomList />
      <AudioControls />
    </>
  )
}

export default HookUseStateDemo
